<template>
	<div id="app" style="background:#FBFBFB">
        <!-- 倒计时 -->
		<div class="index-top" @click="changetest">
			<div class="indextopleft">
				<img src="../../assets/image/changetext.png" alt="">
				<span class="indextopspan" v-if="subject==1||subject=='1'">
					<span v-if="time!=0||time!='0'">距口腔执业助理医师考试</span>
					<span v-else>距口腔执业助理医师考试</span>
				</span>
				<span class="indextopspan" v-else-if="subject==2||subject=='2'">
					<span v-if="time!=0||time!='0'">距口腔执业医师考试</span>
					<span v-else>距口腔执业医师考试</span>
				</span>
				<span class="indextopspan" v-else>
					<span v-if="time!=0||time!='0'">距口腔中级医师考试</span>
					<span v-else>预祝2019年主治医师通关晋升</span>
				</span>
			</div>
			<div class="indextopright" v-if="time!=0||time!='0'">
				<div class="indextime"><span>{{time}}</span>天</div>
			</div>
		</div>
		
		<!-- 轮播图 -->
		<mt-swipe :auto="3000" class="indeximg">
		  <mt-swipe-item ><img src="../../assets/image/imgtop.png" alt="" class="img"></mt-swipe-item>
		  <!-- <mt-swipe-item v-for="(item,index) in lunbo" :key="index" @click.native="tu(item)"><img :src="img+item.image" alt="" class="img"></mt-swipe-item> -->
		</mt-swipe>
		
		<div class="indexevery">
		    <!-- 每日一练,章节，题型，我的考试 -->
			<div class="indexcharper">
				<div class="indexeveryitem" @click="everyclick">
					<div class="itempic">
						<img src="../../assets/image/everyprice.png" alt="">
					</div>
					<div class="indextext">每日一练</div>
				</div>
				<div class="indexeveryitem" @click="charperclick">
					<div class="itempic">
						<img src="../../assets/image/charpeper.png" alt="">
					</div>
					<div class="indextext">章节练习</div>
				</div>
				<div class="indexeveryitem" @click="typeclick">
					<div class="itempic">
						<img src="../../assets/image/type.png" alt="">
					</div>
					<div class="indextext">题型练习</div>
				</div>
				<div class="indexeveryitem" @click="mytextclick">
					<div class="itempic">
						<img src="../../assets/image/mytext.png" alt="">
					</div>
					<div class="indextext">我的考试</div>
				</div>
			</div>
			<!-- 收藏笔记,错题，会员中心，购买记录 -->
			<div class="indexcharper indexsecond">
				<div class="indexeveryitem" @click="collectclick(1)">
					<div class="itempic">
						<img src="../../assets/image/collectandnote.png" alt="">
					</div>
					<div class="indextext">收藏/笔记</div>
				</div>
				<div class="indexeveryitem" @click="collectclick(2)">
					<div class="itempic">
						<img src="../../assets/image/everywrong.png" alt="">
					</div>
					<div class="indextext">我的错题</div>
				</div>
				<div class="indexeveryitem" @click="vipclick">
					<div class="itempic">
						<img src="../../assets/image/vipcenter.png" alt="">
					</div>
					<div class="indextext">会员中心</div>
				</div>
				<div class="indexeveryitem" @click="buyclick">
					<div class="itempic">
						<img src="../../assets/image/burecord.png" alt="">
					</div>
					<div class="indextext">购买记录</div>
				</div>
			</div>
		</div>
		
		<div class="intestpadding">
			<!-- 模拟考试 -->
			<div class="indextest" @click="moniclick(1)">
				<div class="indextextleft">
					<img src="../../assets/image/monitext.png" alt="">
					<span>模拟考试</span>
				</div>
				<div class="indextextright">
					<span>独家精选试卷</span>
					<img src="../../assets/image/clickpush.png" alt="">
				</div>
			</div>
			<!-- 历年真题 -->
			<div class="indextest" @click="moniclick(7)">
				<div class="indextextleft">
					<img src="../../assets/image/nextti.png" alt="">
					<span>历年真题</span>
				</div>
				<div class="indextextright">
					<span>独家精选试卷</span>
					<img src="../../assets/image/clickpush.png" alt="">
				</div>
			</div>
			<!-- 考前押题 -->
			<div class="indextest" @click="yaticlick()">
				<div class="indextextleft">
					<img src="../../assets/image/yatinow.png" alt="">
					<span>考前押题</span>
				</div>
				<div class="indextextright">
					<span>绝密考前押题</span>
					<img src="../../assets/image/clickpush.png" alt="">
				</div>
			</div>
			<!-- VIP答题卡 -->
			<div class="indextest" @click="vipcardclick()">
				<div class="indextextleft">
					<img src="../../assets/image/vipdati.png" alt="">
					<span>VIP答题卡</span>
				</div>
				<div class="indextextright">
					<span>面授班专属</span>
					<img src="../../assets/image/clickpush.png" alt="">
				</div>
			</div>
		</div>
		<!-- 登录弹窗 -->
		<div class="shoewr-chenhoupass">
			<div class="chen-contener chenpass">
				<p class="chen-title">提示</p>
				<p class="chen-text chen-textactive">您需要先登录?</p>
				<div class="chen-but">
					<p class="chen-but-no" @click="repeatclose()">取消</p>
					<p class="chen-but-yes chen-but-yesactive" @click="repeatclick()">去登录</p>
				</div>
			</div>
		</div>
		<!-- 答过每日一练弹窗 -->
		<div class="datishower">
			<div class="containerpicdati">
				<div class="chen-contener1 chenpass">
					<p class="chen-title">提示</p>
					<p class="chen-text chen-textactive">你已经答过今日的每日一练</br>是否要重新答题</p>
					<div class="chen-but">
						<p class="chen-but-yes" @click="butclick()">重新答题</p>
						<p class="chen-but-yes">查看解析</p>
					</div>
				</div>
				<div class="closearr" @click="closeclick">
					<img src="static/img/kechengxiangqing/tuichu.png">
				</div>
			</div>
		</div>
	<Footer></Footer>
	</div>
</template>
<script>
	import Footer from '@/components/home/Footer'
	export default {
		name:'questionindex',
		components:{
		  Footer
		},
		data() {
			return {
				time:'',  //倒计时
				subject:'',  //
				is_type:1,  //每日一练 1：没有答题记录 2：有答题记录
			};
		},
		methods:{
			// 点击关闭每日一练弹窗
			closeclick(){
				$('.datishower').fadeOut();
			},
			// 点击切换考试
			changetest(){
				var that = this;
				that.$router.push({
					path:'/changesubject',
				})
			},
			// 提示登录显示
			loginsub(){
				$('.shoewr-chenhoupass').fadeIn();
			},
			// 点击取消
			repeatclose(){
				$('.shoewr-chenhoupass').fadeOut();
			},
			// 点击去登录
			repeatclick(){
				$('.shoewr-chenhoupass').fadeOut();
				this.d();
			},
			// 判断是否登录
			clickevery(path,query){
				var that = this;
				if(localStorage.getItem('token')){
					that.$router.push({
						path:path,
						query:query
					})
				}else{
					that.loginsub();
				}
			},
			// 点击每日一练
			everyclick(){
				var that = this;
				that.getTestDay()
			},	
			// 点击重新答题
			butclick(){
				var query={
					type:10,
					subject:that.subject,
					share:0
				}
				that.clickevery('/questionevery',query)
			},
			// 判断是否答过每日一练
			getTestDay(){
				var that = this;
				var url = this.$store.state.url+'Testpaperdaynew/getTestDay';
				var data ={
					subject:that.subject
				}
				that.request.wxRequest('GET',url,data,function(res){
					if (res.data.errcode == 0 || res.data.errcode == '0') {
					  // console.log(res);
					  var data = res.data.data;
					  var is_type = data.is_type;
					  that.is_type = data.is_type;
					  if(is_type==1||is_type=='1'){
						  var query={
						  	type:10,
						  	subject:that.subject,
						  	share:0
						  }
						  that.clickevery('/questionevery',query)
					  }else{
						  $('.datishower').fadeIn();
					  }
					}
				})
			},
			// 点击章节练习
			charperclick(){
				var that = this;
				var query={
					subject:that.subject,
					share:0
				}
				that.clickevery('/chapers',query)
			},
			// 点击题型练习
			typeclick(){
				var that = this;
				var query={
					subject:that.subject,
					share:0
				}
				that.clickevery('/type',query)
			},
			// 点击我的考试
			mytextclick(){
				var that = this;
				that.clickevery('/mytext','')
			},
			// 点击收藏，笔记，错题
			collectclick(type){
				var that = this;
				var query={
					type:type
				}
				that.clickevery('/collect',query)
			},
			// 模拟考试，历年真题
			moniclick(type){
				var that = this;
				var query={
					type:type,
					subject:that.subject,
					share:0
				}
				that.clickevery('/testlist',query)
			},
			// 考前押题
			yaticlick(){
				var that = this;
				var query={
					subject:that.subject,
					share:0
				}
				that.clickevery('/textfirst',query)
			},
			// 点击vip答题卡
			vipcardclick(){
				var that = this;
				that.clickevery('/vipcard','')
			},
			// 点击会员中心
			vipclick(){
				var that = this;
				that.clickevery('/vipcenter','')
			},
			// 点击购买中心
			buyclick(){
				var that = this;
				that.clickevery('/buyrecord','')
			},
           // 获取倒计时
		   testTime(){
			   var that = this;
			   var url = this.$store.state.url+'MyTk/testTime';
			   var data ={
				   subject:that.subject
			   }
				
			   that.request.wxRequest('GET',url,data,function(res){
				if (res.data.errcode == 0 || res.data.errcode == '0') {
				  // console.log(res);
				  var data = res.data.data;
				  that.time = data;
				}
			   })
		   }
	    },
		mounted(){
			var that = this;
			if(localStorage.getItem('othersubject')){
				that.subject = localStorage.getItem('othersubject');
			}
			that.testTime();
		}
	}
</script>

<style scoped>
.index-top{
	width: 6.9rem;
	margin:.2rem auto;
	height: .74rem;
	line-height: .74rem;
	color: #0287FF;
	font-size: .28rem;
	display: flex;
	justify-content: space-between;
	background: #E8F3FD;
}
.indextopleft{
	display: flex;
	justify-content: flex-start;
}
.indextopleft img{
	width: .3rem;
	height: .3rem;
	margin-left: .22rem;
	display: inline-block;
	margin-top: .22rem;
}
.indextopleft .indextopspan{
	display: block;
	margin-left: .2rem;
}
.indextopright{
	padding-right: .3rem;
}
.indextopright span{
	height: .44rem;
	line-height: .44rem !important;
	display: inline-block;
	background: #D1E8FD;
	font-size: #0287FF;
	padding: 0 .02rem 0 0.12rem;
	letter-spacing:.1rem;
	margin-right: .11rem;
	border-radius: .08rem;
	font-weight: 600;
}
/* 轮播 */
.indeximg{
	width: 6.9rem;
	height: 2.2rem;
	margin: auto;
}
.indeximg img{
	width: 100%;
	height: 100%;
}
.indexsecond{
	margin:0.05rem auto !important;
}
.indexevery{
	width: 100%;
	height: 3.6rem;
	background: url('../../assets/image/backtop.png'); 
	background-size:100% 100%; 
}
.indexcharper{
	width: 6.9rem;
	margin: auto;
	display: flex;
	justify-content: space-between;
}
.indexeveryitem{
	/* width: 1.5rem; */
	margin-top: .24rem;
	padding: 0 .3rem;
}
.itempic{
	width: .89rem;
	height: .88rem;
	margin: auto;
}
.itempic img{
	width: 100%;
	height: 100%;
}
.indextext{
	margin-top: .14rem;
	font-size: .24rem;
	color: #000;
	text-align: center;
}
/* 模拟考试 */
.indextest{
	width: 6.9rem;
	height: 1.1rem;
	line-height: 1.1rem;
	margin: .3rem auto 0;
	background: #fff;
	box-shadow:0px 0px 0.15rem 0px rgba(0, 0, 0, 0.06);
	border-radius: .1rem;
	display: flex;
	justify-content: space-between;
}
.indextextleft{
	padding-left: .3rem;
	display: flex;
	justify-content: flex-start;
}
.indextextleft img{
	width: .5rem;
	height: .5rem;
	display: inline-block;
	margin-top: .3rem;
}
.indextextleft span{
	display: inline-block;
	margin-left: .3rem;
	color: #000;
	font-size: .28rem;
	font-weight: bold;
}
.indextextright{
	display: flex;
	justify-content: flex-end;
	padding-right: .3rem;
}
.indextextright img{
	width: .3rem;
	height: .3rem;
	margin-top: .4rem;
}
.indextextright span{
	color: #C2C9D3;
	font-size: .24rem;
	margin-right: .2rem;
}
.intestpadding{
	padding-bottom: 1.5rem;
}
</style>
